<template>
  <el-card>
    <el-card>
      <el-descriptions title="离线模式（API上报）" class="cdes">
        <!--  <el-descriptions-item label="日期">2024年5月9日</el-descriptions-item> -->
        <el-descriptions-item label="项目ID">{{ this.info.projectId }}</el-descriptions-item>
        <el-descriptions-item label="项目名称">{{ this.info.projectName }}</el-descriptions-item>
        <el-descriptions-item label="测试Id">{{ this.info.testId }}</el-descriptions-item>
        <el-descriptions-item label="开始时间">{{ this.info.startTime }}</el-descriptions-item>
        <el-descriptions-item label="结束时间">{{ this.info.endTime }}</el-descriptions-item>
        <el-descriptions-item label="累计耗时">{{ this.costIime }}</el-descriptions-item>
        <el-descriptions-item label="实际/目标机器人数">{{ this.info.opcu }}&nbsp;/&nbsp;{{ this.info.tpcu }}</el-descriptions-item>
      </el-descriptions>
      <el-button type="danger" v-if="this.info.status == 1 && this.info.endTime==null">压测中</el-button>
      <el-button type="success" v-if="this.info.status == 0 || this.info.status == null"
        :disabled="true">已结束</el-button>
    </el-card>
    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane label="概括" name="basic"  v-loading="loading">
        <summarization ref="summarization" :info="info" />
      </el-tab-pane>
      <el-tab-pane label="事务数据" name="trans">
        <trans-data ref="transData" :info="info" />
      </el-tab-pane>
      <el-tab-pane label="服务器性能" name="server">
        <!--  <basic-info-form ref="basicInfo" :info="info" /> -->
      </el-tab-pane>
      <el-tab-pane label="压力机性能" name="stress">
        <!--  <basic-info-form ref="basicInfo" :info="info" /> -->
      </el-tab-pane>
    </el-tabs>
  </el-card>
</template>

<style>
.cdes {
  width: 50%;
}
</style>

<script>
import { getRecordReportSum } from "@/api/wetest/stress";
import summarization from "./summarization";
import transData from "./transData";
export default {
  name: "StressReport",
  components: {
    summarization,
    transData
  },
  data() {
    return {
      // 选中选项卡的 name
      activeName: "basic",
      // 表格的高度
      tableHeight: document.documentElement.scrollHeight - 245 + "px",
      // 表信息
      tables: [],
      // 表列信息
      columns: [],
      // 字典信息
      dictOptions: [],
      // 菜单信息
      menus: [],
      info: {},
      testId: "",
      costIime:""
    };
  },
  created() {
    const testId = this.$route.params && this.$route.params.testId;
    this.testId = testId;
    console.log(this.testId);
    this.getReportSum();
  },
  methods: {
    /** 查询压测记录列表 */
    getReportSum() {
      if (this.testId != "" && this.testId != null) {
        this.loading = true;
        getRecordReportSum(this.testId).then(response => {
          console.log(response)
          let d = response.data
          this.info = d
          this.costTime();
          this.loading = false;
        });
      }
    },
    costTime() {
      if (!this.info || !this.info.startTime ) return
      
      
      // 定义两个时间
      var startTime = new Date(this.info.startTime);
      var endTime = new Date();
      if(this.info.endTime){
        endTime  = new Date(this.info.endTime);
      }

      // 计算时间差（单位：毫秒）
      var timeDiff = endTime.getTime() - startTime.getTime();

      // 将时间差转换为小时、分钟和秒
      var hours = Math.floor(timeDiff / (1000 * 60 * 60));
      var minutes = Math.floor((timeDiff % (1000 * 60 * 60)) / (1000 * 60));
      var seconds = Math.floor((timeDiff % (1000 * 60)) / 1000);

      // 格式化显示时间差
      var formattedTimeDiff = hours + "小时 " + minutes + "分钟 " + seconds + "秒";

      //console.log("时间差为：" + formattedTimeDiff);
      this.costIime=formattedTimeDiff;

    },
    handleClick() {
      /* setTimeout(() => {
        if (this.activeName == "basic") {
          this.$refs.summarization.reloyout()
        }else if(this.activeName=="trans"){
          this.$refs.transData.reloyout()
        }
      }, 0); */
    }
  }

};
</script>